import { checkPhone,sendSmscode,checkCode,doFinishRegister } from "@/api/register";
import { defineStore } from "pinia";
import { showDialog,showConfirmDialog   } from "vant"
import router from "@/router"

export const useRegisterStore = defineStore("register", {
    state() {
        return {
            phone: "15200299384", //手机号
            password: "",//密码
            code: "",//验证码
            codeCountDown:0,//验证码倒计时，0表示可以再次发送 不为0 表示已经发送过了，不能发送
        };
    },

    getters: {
        // 手机号页面按钮是否禁用
        phoneButtonIsDisabled(state) {
            const reg = /^1\d{10}/;
            return !reg.test(state.phone)
        },
        // 验证码页面按钮是否禁用
        codeButtonIsDisabled(state){
            return state.code.length !==5;
        },
        // 密码页面按钮是否禁用
        passwordButtonIsDisabled(state){
            return state.password.length !==5;
        }
    },

    actions:{
        /**
         * 第一个页面步骤的提交
         */
        async oneSubmit(){
            // 校验手机号是否可以注册
            await checkPhone(this.phone);
            // 可以注册,触发弹窗showConfirmDialog
            await showConfirmDialog({
                message:'恭喜你，该手机号可以注册，赶紧注册下一步吧',
            });
            
        },
        /**
         * 发送短信验证码
         */
        async sendMsg(){
            //调用接口发送验证码
            const response=await sendSmscode(this.phone)
            //发送成功,设置 codeCountDown = 60
            this.codeCountDown = 3;
            // 做一个倒计时
            const timer=setInterval(()=>{
                // 判断是否为0,为0后就不再减了，清除定时器
                if(this.codeCountDown<=0){
                    clearInterval(timer);
                    return
                }
                this.codeCountDown--;
            },1000)
        },

        // 第二个步骤页面的提交
        async twoSubmit(){
            //调用接口校验验证码
            await checkCode(this.phone,this.code);
            // 校验成功
            await showConfirmDialog({
                message:'校验成功，开始下一步吧'
            });
            // 要使用路由器的实例对象,
            // 1.在页面上将实例对象作为参数传递到这个方法里面
            // 2.直接当前文件引入 @/router文件
            router.push({name:'step-3'})
        },

        // 第三个步骤页面的提交
        async threeSubmit(){
            // 调用接口
            await doFinishRegister(this.phone,this.password);
            //注册成功
            await showDialog({
                message:"恭喜你注册成功，快去登录吧！"
            });
            router.push({name:'login'})
        }
    },
});